<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <title>Keypress Event</title>
        <%= stylesheet_link_tag "../javascripts/ext/resources/css/ext-all.css" %>
        <%= javascript_include_tag "ext/adapter/prototype/prototype.js" %>
        <%= javascript_include_tag "ext/adapter/prototype/scriptaculous.js" %>
        <%= javascript_include_tag "ext/adapter/prototype/effects.js" %>
        <%= javascript_include_tag "ext/adapter/prototype/ext-prototype-adapter.js" %>
        <%= javascript_include_tag "ext/ext-all-debug.js" %>
        <%= javascript_include_tag "ext/build/locale/ext-lang-zh_CN.js" %>
    </head>
    <body>
        <div id="container">
            <div id="toolbar">
            </div>
        </div>
        <script>
            Ext.onReady(function(){
                var searchKey = new Ext.form.TextField({ //text  
                    id: 'searchkey',
                    fieldLabel: 'text',
					fieldLabel:'Search',
                    name: 'text',
                    defaultType: 'textfield',
                    grow: false,
                    //allowBlank: false,
                    blankText: "这个字段最好不要为空",
					enableKeyEvents: true
                    //maskRe: /[a-zA-z]/gi
                });
				searchKey.on('click', function(e){
                    // 监听回车按键   
					Ext.MessageBox.alert('操作信息', "Test Click");
                });
                searchKey.on('specialkey', function(e){
                    // 监听回车按键   
					//var keyname = e.getValue();
					Ext.MessageBox.alert('操作信息', e.getValue());
					//Ext.MessageBox.alert('操作信息', "Test Click");
					//Ext.MessageBox.alert('操作信息', e.getKey());
//                    if (e.getKey() == e.ENTER && this.getValue().length > 0) {
//                        alert("OK");
//                    }
                });
				searchKey.on('fireKey', function(e){
                    // 监听回车按键   
					//Ext.MessageBox.alert('操作信息', "Test Click");
					Ext.MessageBox.alert('操作信息', e.type);
                });
                var form = new Ext.form.FormPanel({
                    baseCls: 'x-plain',
                    labelWidth: 55,
                    url: 'save-form.php',
                    defaultType: 'textfield',
                    items: [searchKey]
                });
                
                var window = new Ext.Window({
                    title: 'Resize Me',
                    width: 500,
                    height: 300,
                    minWidth: 300,
                    minHeight: 200,
                    layout: 'fit',
                    plain: true,
                    bodyStyle: 'padding:5px;',
                    buttonAlign: 'center',
                    items: form,
                    
                    buttons: [{
                        text: 'Send'
                    }, {
                        text: 'Cancel'
                    }]
                });
                
                window.show();
            });
        </script>
    </body>
</html>
